<template>
	<view class="content" @touchmove.stop.prevent="">
			<Title  :title="title" :titleWidth="'90vw'" :imgList="imgList" @add="add(false)" style="position: absolute,top:0"/>
            <view class="scroll">
                <mescroll-uni ref="mescrollRef" @init="mescrollInit" height="100%" top="0"  @down="downCallback" @up="upCallback" :up="up">
                	<view class="item" v-for="item,index in list" @click="add(item)">{{item.sjmc}}</view>
                </mescroll-uni>
            </view>
            
            
	</view>
</template>

<script>
	import Title from './components/title/index'
	import inspectItem from "./components/inspectItem/index.vue";
    import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
    import MescrollMoreItemMixin from "@/components/mescroll-uni/mixins/mescroll-more-item.js";
    import API from '@/common/api.js';
	export default {
        mixins: [MescrollMixin,MescrollMoreItemMixin], // 注意此处还需使用MescrollMoreItemMixin (必须写在MescrollMixin后面)
		components: {
			Title,inspectItem
		},
		data() {
			return {
                up:  {
                		auto:false, // 不自动加载
                		page: {
                			num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
                			size: 15 // 每页数据的数量
                		},
                		noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
                		empty:{
                			tip: '~ 空空如也 ~', // 提示
                			btnText: ''
                		}
                	},
                title:'应急事件',
                pzhAuthorization:uni.getStorageSync('pzhAuthorization'),
				imgList:[{
					img:'add',
					click:'add'
				}],
                list:[],
                cfyid:'',
                cfy_name:'',
                shuaxin:false
			}
		},
		onShow(){
            if(this.shuaxin){
                this.shuaxin=false
                this.triggerDownScroll()
            }
		},
		onLoad(options) {
            if(options.id){
                this.title='相关应急事件'
                this.cfyid=options.id
                this.cfy_name=options.name
            }
            setTimeout(()=>{
                this.triggerDownScroll()
            },100)
		},
		methods: {
            //刷新
            triggerDownScroll(){
            	this.mescroll.triggerDownScroll()
            },
            /*下拉刷新的回调 */
            downCallback() {
            	// 这里加载你想下拉刷新的数据, 比如刷新轮播数据
            	// loadSwiper();
            	// 下拉刷新的回调,默认重置上拉加载列表为第一页 (自动执行 page.num=1, 再触发upCallback方法 )
            	this.mescroll.resetUpScroll()
            },
            /*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */
            upCallback(page) {
                console.log(page,'xxxxxx')
            	//联网加载数据
                let data={start: page.num-1,length: 15,pzhAuthorization:this.pzhAuthorization}
                if(this.cfyid){
                    data.cfyid=this.cfyid
                }
            	API.selectYjsj(data).then(res=>{
            		setTimeout(()=>{
            			if(res.resCode=='success'){
                            uni.hideLoading()
            				if(page.num == 1){
            					this.list = [];
            				}
            				this.list=this.list.concat(res.datas)
            				this.mescroll.endBySize(res.datas.length,res.total);
            			}else{
            				this.list.length?this.mescroll.endErr():this.mescroll.endBySize(0,0);
            			}
            		},page.num==1?500:0)
            	})
            },
            add(data){
                if(data){
                    uni.setStorage({
                        key: 'urgentData',
                        data: JSON.stringify(data)
                    });
                }else{
                    uni.removeStorageSync('urgentData')
                }
            	uni.navigateTo({
            		url:'./urgent?id='+this.cfyid+'&name='+this.cfy_name
            	})
            },
		}
	}
</script>
<style lang="less" scoped>
    /* #ifndef APP-NVUE */
    body {
    	font-size: 30rpx;
    	line-height: 2em;
    	color: #333;
    	font-family: Helvetica Neue, Helvetica, sans-serif;
    }
    
    view,
    text {
    	font-size: 30rpx;
    	line-height: 2em;
    	color: #333;
    }
    
    page {
    	background: #fff;
    }
    
    button {
    	width: 100%;
    }
    /* #endif */
	.content {
        height: 100vh;
		background: #F5F6F9;
		.scroll{
            height: calc(100vh - 94rpx);
            .item {
               padding:30rpx 40rpx 30rpx 0;
                margin-left: 40rpx;
                border-bottom: 2rpx solid #E9E9E9;
            }
        }

	}
</style>
